<template>
  <a-form-item v-bind="option.formProps" :labelCol="{ span: 6, offset: 0 }">
    <component
      :is="option.inputOption.tag"
      v-bind="option.inputOption.props"
      :size="size"
      v-model:value="formModel[option.formProps.name]"
    >
      <template
        v-for="(child, index) in option.inputOption.children"
        :key="index"
      >
        <component :is="child.tag" v-bind="child.props">{{
          child.content && child.content
        }}</component>
      </template>
    </component>
  </a-form-item>
</template>
<script setup lang="ts">
import type { FormItemOption } from '../types'

withDefaults(
  defineProps<{
    size?: 'large' | 'default' | 'small'
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    option: FormItemOption<{ [key: string]: any }>
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    formModel: { [key: string]: any }
  }>(),
  {
    size: 'default',
  }
)
</script>
